<template>
    <el-dropdown @command="handleCommand">
        <el-avatar :src="avatarSrc"></el-avatar>
        <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="logout" divided>退出登录</el-dropdown-item>
        </el-dropdown-menu>
    </el-dropdown>
</template>

<script>
export default {
    data() {
        return {
            avatarSrc: ''
        }
    },
    methods: {
        handleCommand(command) {
            if (command === 'logout') {
                this.$store.dispatch('LogOut').then(() => {
                    this.$router.push('/login')
                }).catch((err) => {
                    console.log(err)
                })
            }
        }
    },
    created() {
        this.avatarSrc = this.$store.state.user.avatar || JSON.parse(localStorage.getItem('userInfo')).image
    }
}
</script>

<style lang="scss" scoped></style>